window.addEventListener('load',function(){
    // alert(111)
    var Mleft =this.document.querySelector('.Ml')
    var Mright =this.document.querySelector('.Mr')
    var focus=this.document.querySelector('.swiper')
    var ul = focus.querySelector('ul')
    var ol = focus.querySelector('.circleT')
    var focusWith=focus.offsetWidth;
    var num=0;
    var circle =0;

    // 节流阀
    // var flage=true;
    // console.log(ul.children.length);
    for(var i=0;i<ul.children.length;i++){
        var li =this.document.createElement('li');
        ol.appendChild(li);
        li.setAttribute('index',i)
        li.addEventListener('click',function(){
            for(var i=0;i<ol.children.length;i++){
                ol.children[i].className='';
            }
            this.className='current'
            var index=this.getAttribute('index')
            num=index;
            circle=index;
            // console.log(focusWith);
            // console.log(index);
            animate(ul,-index*focusWith);
        })
    }
    ol.children[0].className='current';
    var first =ul.children[0].cloneNode(true);
    ul.appendChild(first)
    // focus.addEventListener('mouseenter',function(){
    // }),
    // focus.addEventListener('mouseleave',function(){
    //     Mright.style.display='none'
    //     Mleft.style.display='none'
    // }),
    Mright.addEventListener('click',function(){
        // if(flage){
        //     flage=false
            if(num<ul.children.length-1){
                num++;
                }else{
                    ul.style.left=0
                    num=1;
                }
                animate(ul,-num*focusWith);
                // animate(ul,-num*focusWith,function(){
                // flage=true
                // });
                circle++;
                if(circle==ol.children.length){
                    circle=0;
                }
                circleChange()
        // }
        
    })
    Mleft.addEventListener('click',function(){
      
        if(num==0){
            num=ul.children.length-1;
            ul.style.left=-num*focusWith+'px'
        }
            num--;
            animate(ul,-num*focusWith);
            circle--;
            if(circle<0){
                circle=ol.children.length-1;
            }
            circleChange()
    });

    function circleChange(){
        for(var i =0;i<ol.children.length;i++){
            ol.children[i].className=''
        }
        ol.children[circle].className='current'
    }

    // 自动播放
    var timer =this.setInterval(function(){
        Mright.click()
    },2000)
})